<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>uupaa-mutationevent.js - Reference</title>
<style type="text/css">@import url(./README.css);</style>
</head>
<body>
<p>
   | <a href="http://code.google.com/p/uupaa-js-spinoff/">Project Home(Google Code)</a>
   | <a href="./README.htm">README</a>
   | <a href="./CLASS.htm">Reference</a> |<br />
   | <a href="./CHANGELOG.htm">ChangeLog</a>
   | <a href="./LICENSE.htm">License</a>
   |
</p>

<hr />
|
<a href="#uuClass.MutationEvent">uuClass.MutationEvent</a> |
<a href="#uuClass.MutationEventLite">uuClass.MutationEventLite</a> |
<a href="#uuConst.MutationEvent">uuConst.MutationEvent</a> |

<hr />
<h2><a name="uuClass.MutationEvent">uuClass.MutationEvent</a></h2>
<p>ドキュメントツリーの更新を検出する機能を提供します。</p>
<hr />
<dl>
<!-- -->
  <dt><a name="uuClass.MutationEvent">uuClass.MutationEvent</a></dt>
  <dd><p>uuClass.MutationEvent(<i>fn</i>, <i>hook</i> = uuConst.MutationEvent.All, <i>enable</i> = true, <i>ignore</i> = "") は
      初期設定を行い、監視を開始します。</p>
<pre>
@param Function fn       - ドキュメントツリーが更新されたタイミングでコールバックする関数を指定します。
                           コールバック関数の第一引数には発生したイベントの種類(0x1, 0x2, 0x4)が渡されます。
                           0x1 = uuConst.MutationEvent.Tree
                           0x2 = uuConst.MutationEvent.Node
                           0x4 = uuConst.MutationEvent.Attr
@param <a href="#uuConst.MutationEvent">uuConst.MutationEvent</a>
                [hook]   - 監視するイベントをビットの組み合わせで指定します。
                           デフォルトは uuConst.MutationEvent.All です。
@param Boolean  [enable] - 監視を開始するなら true を、監視を停止した状態で初期化するなら false を指定します。
                           デフォルトは true です。
@param String   [ignore] - 監視対象外とする属性名をカンマ区切りの文字列で指定します。
                           デフォルトは空文字列( "" )です。スタイル名("style.color"等)は指定できません。
</pre>
<p>複数のイベントを同時に監視する場合は、定数(uuConst.MutationEvent)を OR演算子( "|" ) で組み合わせて指定します。</p>
<pre class="eg">
function callback(mutation) { <u>// 第一引数(mutation)には 0x1, 0x2, 0x4 のいずれかの値が渡されます。</u>
  alert("fire " + mutation);
}
<b>uuClass.MutationEvent</b>(callback, <b>uuConst.MutationEvent.Node | uuConst.MutationEvent.Attr</b>);
</pre>
<p>特定の属性変更を無視したい場合は ignore を指定します。以下は title 属性と innerHTML への代入を監視対象外としています。</p>
<pre class="eg">
function callback(mutation) {
  alert("fire " + mutation);
}
<b>uuClass.MutationEvent</b>(callback, 7, 1, "title,innerHTML");
</pre>

  </dd>

<!-- -->
  <dt><a name="uuClass.MutationEvent.enable">uuClass.MutationEvent.enable</a> - enable hook</dt>
  <dd><p>uuClass.MutationEvent.enable() は イベントの監視を開始します。既に監視中なら何も行いません。</p>
  </dd>
<!-- -->
  <dt><a name="uuClass.MutationEvent.disable">uuClass.MutationEvent.disable</a> - disable hook</dt>
  <dd><p>uuClass.MutationEvent.disable() は イベントの監視を停止し、age を + 1します。既に停止中なら何も行いません。</p>
  </dd>
<!-- -->
  <dt><a name="uuClass.MutationEvent.age">uuClass.MutationEvent.age</a></dt>
  <dd><p>uuClass.MutationEvent.age は イベントが発生するとインクリメント(+1)される整数値です。
         <br />1アクションで複数のイベントが同時に発生した場合は +2 や +3 された値になります。
      </p>
  </dd>
</dl>


<hr />
<h2><a name="uuClass.MutationEventLite">uuClass.MutationEventLite</a></h2>
<p>ドキュメントツリーの更新を知る簡単な手段を提供します。uuClass.MutationEvent とは以下の違いがあります。
<ul>
<li>コールバック関数を省略できます。</li>
<li>コールバック関数の第一引数に、イベントの種類(0x1, 0x2, 0x4)が渡されません。</li>
<li>MutationEventLite は IE8, WebKit(Safari, Chrome)をサポートしていません。</li>
<li>監視するMutationEventの種類を指定できません(<a href="#uuConst.MutationEvent.All">uuConst.MutationEvent.All</a>のみ監視できます)。</li>
<li>監視対象外とする属性名を指定できません。</li>
</ul>
<hr />
<dl>
<!-- -->
  <dt><a name="uuClass.MutationEventLite">uuClass.MutationEventLite</a></dt>
  <dd><p>uuClass.MutationEventLite(<i>fn</i> = null, <i>enable</i> = true) は
      初期設定を行い、監視を開始します。</p>
<pre>
@param Function [fn]     - ドキュメントツリーが更新されたタイミングでコールバックする関数を指定します。
                           デフォルトは null です。
                           null を指定するとコールバックしません(uuClass.MutationEventLite.age はインクリメントされます)。
@param Boolean  [enable] - 監視を開始するなら true を、監視を停止した状態で初期化するなら false を指定します。
                           デフォルトは true です。
</pre>
<pre class="eg">
function callback(mutation) { <u>// mutation は undefined</u>
  alert("fire");
}
<b>uuClass.MutationEventLite</b>(callback);
</pre>
  </dd>

<!-- -->
  <dt><a name="uuClass.MutationEventLite.enable">uuClass.MutationEventLite.enable</a> - enable hook</dt>
  <dd><p>uuClass.MutationEventLite.enable() は イベントの監視を開始します。既に監視中なら何も行いません。</p>
  </dd>
<!-- -->
  <dt><a name="uuClass.MutationEventLite.disable">uuClass.MutationEventLite.disable</a> - disable hook</dt>
  <dd><p>uuClass.MutationEventLite.disable() は イベントの監視を停止し、age を + 1します。既に停止中なら何も行いません。</p>
  </dd>
<!-- -->
  <dt><a name="uuClass.MutationEventLite.age">uuClass.MutationEventLite.age</a></dt>
  <dd><p>uuClass.MutationEventLite.age は イベントが発生するとインクリメント(+1)される整数値です。
      </p>
  </dd>
</dl>

<hr />
<h2><a name="uuConst.MutationEvent">uuConst.MutationEvent</a></h2>
<p>監視可能なMutationEventイベントの一覧</p>
<table>
<tr><th>Enum</th><th>Value</th><th>Event</th></tr>
<tr><td><a name="uuConst.MutationEvent.Tree">uuConst.MutationEvent.Tree</a></td><td>0x1</td><td><a href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113/events.html#Events-eventgroupings-mutationevents">DOMSubtreeModified</a> を監視</td></tr>
<tr><td><a name="uuConst.MutationEvent.Node">uuConst.MutationEvent.Node</a></td><td>0x2</td><td><a href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113/events.html#Events-eventgroupings-mutationevents">DOMNodeInserted</a> と <a href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113/events.html#Events-eventgroupings-mutationevents">DOMNodeRemoved</a> を監視</td></tr>
<tr><td><a name="uuConst.MutationEvent.Attr">uuConst.MutationEvent.Attr</a></td><td>0x4</td><td><a href="http://www.w3.org/TR/2000/REC-DOM-Level-2-Events-20001113/events.html#Events-eventgroupings-mutationevents">DOMAttrModified</a> を監視</td></tr>
<tr><td><a name="uuConst.MutationEvent.All">uuConst.MutationEvent.All</a></td><td>0x7</td><td>上記のイベントを同時に監視</td></tr>
</table>

</body>
</html>
